<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%--
  Created by IntelliJ IDEA.
  User: 18134216985
  Date: 2024-03-29
  Time: 8:30
  To change this template use File | Settings | File Templates.
--%>
<link rel="stylesheet" href="/webjars/layui/2.6.8/css/layui.css">
<script src="/webjars/layui/2.6.8/layui.js"></script>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>收费项目</title>
</head>
<body>
<%--条件查询--%>
<div class="layui-collapse">
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">查询条件</h2>
        <div class="layui-colla-content layui-show">
            <div class="layui-form"  id="searchForm" lay-filter="searchForm">
                <div class="layui-inline">
                    <input name="itemName" class="layui-input" placeholder="收费项目">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" onclick="search()" >查询</button>
                </div>

            </div>
        </div>
    </div>
</div>
<table class="layui-hide" id="ID-table-demo-data" lay-filter="itemTable"></table>
<%--行工具栏--%>
<script type="text/html" id="barDemo">
        <button class="layui-btn layui-btn-sm layui-btn-warm" lay-event="update">编辑</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete" >删除</button>
</script>
<%--头部工具栏，添加--%>
<script type="text/html" id="headTool">
        <button class="layui-btn" onclick="add()">添加项目</button>
</script>
<%--修改页面--%>
<div id="update" style="display:none;padding:20px">

    <form class="layui-form" id="updateForm" lay-filter="updateForm">
        <div class="layui-form-item">
            <label class="layui-form-label">收费项目:</label>
            <div class="layui-input-block">
                <input type="text" name="itemname" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">单价:</label>
            <div class="layui-input-block">
                <input type="text" name="oneprice" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">数量:</label>
            <div class="layui-input-block">
                <input type="text" name="num" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">计算公式:</label>
            <div class="layui-input-block">
                <input type="text" name="arithmetic"   class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">计算周期:</label>
            <div class="layui-input-block">
                <input type="text" name="time"   class="layui-input">
            </div>
        </div>
        <input type="text" name="id" class="layui-hide">
    </form>
</div>
<%--添加页面--%>
<div id="add" style="display:none;padding:20px">

    <form class="layui-form" id="addForm" lay-filter="addForm">
        <div class="layui-form-item">
            <label class="layui-form-label">收费项目:</label>
            <div class="layui-input-block">
                <input type="text" name="itemname" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">单价:</label>
            <div class="layui-input-block">
                <input type="text" name="oneprice" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">数量:</label>
            <div class="layui-input-block">
                <input type="text" name="num" required  class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">计算公式:</label>
            <div class="layui-input-block">
                <input type="text" name="arithmetic"   class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">计算周期:</label>
            <div class="layui-input-block">
                <input type="text" name="time"   class="layui-input">
            </div>
        </div>
        <input type="text" name="id" class="layui-hide">
    </form>
</div>
<script>
    let $=layui.$;
    let table=layui.table;
    layui.use('table',function (){
       table.render({
            id:'charge',
            elem:'#ID-table-demo-data',
            url:"/Item/selectAllItem",
            toolbar: '#headTool',
           page:true,
           limit:6,
           limits:[6,12,18,24],
           cols : [[
               {title:"编号",type:'numbers'},
               {field:'id',title:"编号",hide:true},

               {field:'itemname',title:"收费项目"},
               {field:'oneprice',title:"单价"},
               {field:'num',title:"数量"},
               {field:'arithmetic',title:"计算公式"},
               {field:'time',title:"计算周期"},
               {title: '操作',toolbar:'#barDemo'}
            ]]
        })
    })
    //监听行工具
    table.on("tool(itemTable)",function (obj){
        if(obj.event=="delete"){
            deletes(obj.data.id);
        }else if(obj.event=="update"){
            updates(obj);
        }
    })
    //点击查询
    function search(){

        var where=layui.form.val('searchForm');
        console.log(where)
        layui.table.reload('charge',{where});
    }
    //点击编辑
    function updates(obj){
        layui.form.val('updateForm',obj.data);
        layui.layer.open({
            title:"修改收费项目",
            type : 1,
            area:["500px","500px"],
            content:$("#update"),
            btn:["确定","取消"],
            yes(){
                let updateForm=layui.form.val("updateForm");
                $.post("/Item/updateItem",updateForm).then(({msg})=>{
                    layui.layer.close(layui.layer.index);
                    layui.layer.msg(msg);
                    layui.table.reload('charge')
                })
            }
        })
    }
    //点击删除
    function deletes(id){
        layui.layer.open({
            type:0,
            icon:3,
            area:["250px","200px"],
            title:"提示",
            content:"确定删除吗？",
            btn:["确定","取消"],
            yes(){
                $.get("/Item/deleteItem?id="+id)
                .then(({msg})=>{
                    layui.layer.close()
                    layui.layer.msg(msg);
                    layui.table.reload('charge')
                })

            }

        })
    }
    //点击添加
    function add(){
        layui.layer.open({
            type:1,
            title:"添加",
            area:["500px","500px"],
            content:$("#add"),
            btn:["确定","取消"],
            yes(){
                let addform=layui.form.val("addForm");
                console.log(addform)
                $.post("/Item/addItem",addform).then(({msg})=>{
                    layui.layer.close(layui.layer.index)
                    layui.layer.msg(msg);
                    layui.table.reload('charge');
                })
            }
        })
    }
</script>
</body>
</html>
